<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/SiteUTF8.master" Inherits="System.Web.Mvc.ViewPage<IEnumerable<web_uchet.ViewModels.ViewOrderChanges>>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Журнал изменений заказов
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
    function InitDialog() {
        jQuery('body').append('<div id="dialog" title="Сообщение"><p><span class="ui-icon ui-icon-circle-check" style' +
        '="float:left; margin:0 7px 50px 0;"></span><span  id="span-dialog"></span></p></div>');
        jQuery("#dialog").dialog({
            autoOpen: false,
            bgiframe: true,
            modal: false,
            buttons: {
                Ok: function() {
                    jQuery(this).dialog('close');
                }
            }
        });
    }
    function OrderDetails() {
        var grid = jQuery("#list");
        var rowKey = grid.getGridParam("selrow");
        if (rowKey) {
            jQuery("#div-html-loader").load('/ViewOrder/Details/' + grid.getCell(rowKey, 'OrderID'));
        }
        else {
            jQuery("#span-dialog").html('');
            jQuery("#span-dialog").html("Сначала выберите запись");
            jQuery("#dialog").dialog('open');
        }
    }    
</script>    
<table id="list"></table>
    <div id="pager">
    </div>
    <table cellspacing="0" id="toolbar-content" cellpadding="0" border="0" role="row" 
    style="height:100%; width: 100%; table-layout: fixed;" class="ui-pg-table">
    <tbody>
    <tr>    
    <td align="left" id="pager_left">
        <table cellspacing="0" cellpadding="0" border="0" style="float: left; table-layout: auto;" class="ui-pg-table navtable">
        <tbody>
            <tr>
            <td class="ui-pg-button ui-corner-all" title="Перейти на страницу с деталями заказа" style="cursor: pointer;">
                <div class="ui-pg-div" onclick="OrderDetails();">
                <span class="ui-icon ui-icon ui-icon-carat-1-e"></span>Просмотреть заказ 
                </div>
            </td>
            <td style="width: 4px;" class="ui-pg-button ui-state-disabled">
                <span class="ui-separator"></span>
            </td>               
            </tr>
        </tbody></table>
    </td>
    
    </tr></tbody></table>
    <div id="div-html-loader"></div>
    <script type="text/javascript">
        jQuery.noConflict();
        jQuery(document).ready(function() {
            InitDialog();
            var pager = jQuery('#pager');

            jQuery("#list").jqGrid({
                url: '/ViewOrderChanges/Index',
                datatype: 'json',
                mtype: 'GET',
                colNames: ['OrderID','Сотрудник', 'Старые значения', 'Новые значения'],
                colModel: [
      { name: 'OrderID', index: 'OrderID', sortable: false, hidden: true, align: 'left', search: false},
      { name: 'Пользователь', index: 'Пользователь.Имя_Настоящее', width: 100, align: 'left', searchoptions: { sopt: ['eq', 'ne', 'cn', 'bw']} },
      { name: 'Старое_Значение', index: 'Старое_Значение', sortable: false, width: 100, align: 'left', search: false },
      { name: 'Новое_Значение', index: 'Новое_Значение', sortable: false, width: 100, align: 'left', search: false}],
                pager: pager,
                rowNum: 12,
                rowList: [6, 12, 18, 24],
                sortname: 'ИД_Изменения',
                sortorder: "desc",
                viewrecords: true,
                imgpath: '/Content/images',
                caption: 'Изменения заказов компании',
                autowidth: true,
                height: 500,
                toolbar: [true, 'top']
            });
            jQuery("#list").navGrid('#pager', { refresh: true, add: false, del: false, edit: false, search: true, view: false },
       {}, // default settings for edit
       {}, // default settings for add
       {}, // delete
       {closeOnEscape: true, multipleSearch: true, closeAfterSearch: true }, // search options
       {}
     ).navSeparatorAdd("#pager", { sepclass: "ui-separator" });
            jQuery("#t_list").height(24); //Set height of toolbar
            jQuery("#t_list").append(jQuery('#toolbar-content'));
        });        
    </script>
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="HeadContent" runat="server">
<link href="/Scripts/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" />
<link href="/Scripts/ui.jqgrid.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/Scripts/i18n/grid.locale-ru.js"></script>
<script src="/Scripts/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="/Scripts/grid.jqueryui.js" type="text/javascript"></script>
<script src="/Scripts/ui.core.js" type="text/javascript"></script>
<script src="/Scripts/ui.dialog.js" type="text/javascript"></script> 
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="HintListPlaceHolder" runat="server">
</asp:Content>

